<!DOCTYPE html>
<html>
  <!--
  Copyright 2014 The Chromium Authors. All rights reserved.
  Use of this source code is governed by a BSD-style license that can be
  found in the LICENSE file.
  -->
<head>
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Expires" content="-1">
  <title>{{title}}</title>
  <script type="text/javascript" src="common.js"></script>
  <script type ="text/javascript" src="example.js"></script>
</head>
<body {{attrs}}>
  <h1>{{title}}</h1>
  <h2>Status: <code id="statusField">NO-STATUS</code></h2>
  <p>This example demonstrates sending messages from JavaScript to the Native
     Client module, and from the Native Client module to JavaScript.</p>
  <p>There are two ways to do this: asynchronously and sychronously.</p>
  <p><code>postMessage()</code> sends a message from JavaScript to the module
     asynchronously. This means that the response must be handled in a callback.
  </p>
  <p><code>postMessageAndAwaitResponse()</code> sends a message synchronously.
     JavaScript execution is blocked while the module generates and sends back
     a response. The response from the module is returned from the call to
     <code>postMessageAndAwaitResponse()</code>, so no callback is necessary.
  </p>
  <p>Take a look at <code>example.js</code> to see the difference between these
  two methods.</p>
  <div>
    <div>
      <label for="addend1">1st Number:</label>
      <input type="number" id="addend1" value="123">
    </div>
    <div>
      <label for="addend2">2nd Number:</label>
      <input type="number" id="addend2" value="234">
    </div>
    <div>
      <label for="result">Sum:</label>
      <span id="result"></span>
    </div>
    <input type="button" id="addAsync" value="Add Asynchronously">
    <input type="button" id="addSync" value="Add Synchronously">
  </div>
  <div id="listener"></div>
</body>
</html>
